<template>
  <div>
    <el-dialog :visible.sync="upload.open" width="80%" append-to-body class="detail-class">
      <div slot="title" class="header flex-between">
        <div class="flex-rowl">
          <div class="flex-rowl mr10 pointer" @click="upload.open = false">
            <i class="el-icon-switch-button color-fff mr5"></i>
            <span class="color-fff size-14">关闭</span>
          </div>
          <div class="flex-rowl mr10 pointer" @click="handleSubmit(0)" v-if="upload.type=='1'||upload.type=='2'">
            <i class="el-icon-finished color-fff mr5"></i>
            <span class="color-fff size-14">保存</span>
          </div>
          <div class="flex-rowl pointer" @click="handleSubmit(1)" v-if="upload.type!='0'||form.businessStatusName=='已审批'&&upload.way=='0'">
            <i class="el-icon-position color-fff mr5"></i>
            <span class="color-fff size-14">提交</span>
          </div>
        </div>
        <!-- <div class="flex-rowl pointer">
          <i class="el-icon-printer color-fff mr5"></i>
          <span class="color-fff size-14">打印</span>
        </div> -->
      </div>
      <div class="title">会议通知</div>
      <div style="display: flex;justify-content: space-between;">
        <span>当前状态: {{getStatus()}}</span>
        <span>业务单编号: {{form.businessId}}</span>
      </div>
      <el-descriptions :column="2" border>
        <el-descriptions-item>
          <template slot="label">
            承办人
          </template>
          {{ form.agentName }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            承办部门
          </template>
          {{ form.deptName }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            申请日期
          </template>
          {{ form.publishTime }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            联系电话
          </template>
          <el-input v-if="upload.type=='1'" v-model="form.telephone" placeholder="请输入内容" />
          <div v-else>{{ form.telephone }}</div>
        </el-descriptions-item>
        <el-descriptions-item :span="2">
          <template slot="label">
            会议标题
          </template>
          <el-input v-if="upload.type=='1'" v-model="form.title" placeholder="请输入内容" />
          <span v-else>{{ form.title }}</span>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            会议开始时间
          </template>
          <el-date-picker style="width: 100%" v-if="upload.type=='1'" v-model="form.startTime" type="datetime" placeholder="选择日期时间" :picker-options="pickerOptions" value-format="yyyy-MM-dd HH:mm" />
          <span v-else>{{ form.startTime }}</span>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            会议结束时间
          </template>
          <el-date-picker style="width: 100%" v-if="upload.type=='1'" v-model="form.endTime" type="datetime" placeholder="选择日期时间" :picker-options="pickerOptions" value-format="yyyy-MM-dd HH:mm" />
          <span v-else>{{ form.endTime }}</span>
        </el-descriptions-item>
        <el-descriptions-item :span="2">
          <template slot="label">
            会议地点
          </template>
          <el-input v-if="upload.type=='1'" v-model="form.meetAddress" placeholder="请输入内容" />
          <span v-else>{{ form.meetAddress }}</span>
        </el-descriptions-item>
        <el-descriptions-item :span="2">
          <template slot="label">
            参会人员
          </template>
          <span>
            {{ form.readerNames }}
            <el-button v-if="upload.type == '1'" style="float: right;" @click="openSelect('reader')" type="primary" plain size="mini">选择</el-button>
          </span>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            会议主持人
          </template>
          {{ form.meetLeader }}
          <el-button v-if="upload.type=='1'" style="float: right;" @click="openSelect('leader')" type="primary" plain size="mini">选择</el-button>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            参会人数
          </template>
          <el-input v-if="upload.type=='1'" v-model="form.meetNumber" placeholder="请输入内容" />
          <span v-else>{{ form.meetNumber }}</span>
        </el-descriptions-item>
        <el-descriptions-item :span="2">
          <template slot="label">
            其他参会人员
          </template>
          <el-input v-if="upload.type=='1'" v-model="form.meetAttender" placeholder="请输入内容" />
          <span v-else>{{ form.meetAttender }}</span>
        </el-descriptions-item>
        <el-descriptions-item :span="2">
          <template slot="label">
            正文
          </template>
          <el-input v-if="upload.type=='1'" type="textarea" :rows="4" placeholder="请输入内容" v-model="form.content" autosize />
          <span v-else>{{ form.content }}</span>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label" :span="2">
            备注
          </template>
          <el-input v-if="upload.type=='1'" v-model="form.memo" placeholder="请输入内容" />
          <span v-else>{{ form.memo }}</span>
        </el-descriptions-item>
      </el-descriptions>
      <el-descriptions v-if="upload.type=='1'||form.businessStatusName=='已审批'&&upload.way=='0'" :column="1" border style="margin-top: 10px;">
        <el-descriptions-item>
          <template slot="label">
            选择路径
          </template>
          <el-radio-group v-model="form.businessStatus">
            <el-radio label="UNDO">送审</el-radio>
            <el-radio label="DONE">发布通知</el-radio>
          </el-radio-group>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            添加审批人
          </template>
          {{ form.auditorNames }}
          <el-button v-if="upload.type=='1'" style="float: right;" @click="openSelect('auditor')" type="primary" plain size="mini">选择</el-button>
        </el-descriptions-item>
      </el-descriptions>
      <!-- 表单 -->
      <el-descriptions v-if="upload.type=='3'" :column="1" border style="margin-top: 10px;">
        <el-descriptions-item>
          <template slot="label">
            回执内容
          </template>
          <el-radio-group v-model="form.meetAttendStatus">
            <el-radio label="0">参加会议</el-radio>
            <el-radio label="1">请假</el-radio>
          </el-radio-group>
          <el-input class="mt10" v-if="form.meetAttendStatus=='1'" type="textarea" :rows="4" placeholder="请填写不能参加会议的原因" v-model="form.receiptMemo" autosize />
        </el-descriptions-item>
      </el-descriptions>
      <!-- 处理意见渲染 -->
      <div class="message mt10" v-if="Array.isArray(form.auditItems) && form.auditItems.length">
        <div class="flex-rowl message-item" v-for="item in form.auditItems" :key="item.id">
          <div class="size-14 hed">审批意见</div>
          <div class="flex-1 content">
            <div class="size-14 mb8">{{ item.memo }}</div>
            <div class="flex-rowr size-14 mr10">{{ item.operatorName }} {{ item.completeTime }}</div>
          </div>
        </div>
      </div>
      <template v-if="upload.type=='2'">
        <ZfwFormAdd :formData="form" :fileds="subFileds" ref="formSubAddRef" class="mt10" />
      </template>
      <div v-if="form.businessId" style="display: flex;margin-top: 10px;flex-direction: column;">
        <span>附件展示: </span>
        <ZfwFileTable :files="form.busiAttachs" :businessId="form.businessId" :disabled="upload.way!='0'||upload.type!='1'"
          @upload="handleUpload" />
      </div>
    </el-dialog>
    <select-user ref="select" :selectType="selectType" @getUserInfo="getUserInfo"></select-user>
  </div>
</template>

<script>
import ZfwFormAdd from "@/components/zfw-common/zfw-form-add/index"
import ZfwFileTable from "@/components/zfw-common/zfw-file-table/index.vue"
import { auditInfo, auditSave, getMessage, noticeInfo, taskInfo, updateRead } from '../../../api/xzgl/hytz';
import { filterNull } from '../../../utils/buspost';
import selectUser from './selectUser.vue';
import { replaceFormData } from "../../../utils/common";

export default {
  components: {selectUser, ZfwFileTable, ZfwFormAdd},
  props: {
    upload: {
      type: Object,
      // 导入参数
      default: {
        // 是否显示弹出层
        open: false,
        // 弹出层标题
        title: "会议通知",
        // 打开方式 0 查看, 1 新增, 2 审批, 3 回执
        type: '0',
        //way 0 我发起, 1 我参与, 2 我审批
        way: '0',
        // 详情信息
        row: {}
      }
    },
  },
  data() {
    return {
      form: {
        agentName: '',
        businessId: '',
        deptName: '',
        publishTime: '',
        readerNames: '',
        meetLeader: '',
        auditorNames: '',
        businessStatus:'',
        meetAttendStatus: null
      },
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now()-86400*1000;//禁止选择今天以前的时间
        }
      },
      selectType: '',
      fileList: [],
      methodDict: {
        '0': auditInfo,
        '1': noticeInfo,
        '2': taskInfo
      },
      fileds: [{
        key: "receiptStatus",
        filedType: "custom",
        label: "是否需要回执",
        span: 12,
      },],
      subFileds: [{
        key: "auditMemo",
        filedType: "Input",
        label: "审批意见",
        span: 24,
        props: {
          placeholder: "请输入审批意见",
          type: "textarea",
          rules: [
            {
              required: true,
              message: "请输入审批意见",
              trigger: "blur",
            },
          ],
        },
      }]
    };
  },
  created() {
    this.init()
  },
  methods: {
    init() {
      let params = {}
      if(this.upload.row.businessId) {
        params.id = this.upload.way=='0'?this.upload.row.businessId:this.upload.row.id
      }
      console.log(this.upload.way)
      this.methodDict[this.upload.way](params).then(res=>{
        if(this.upload.type=='1') this.form.publishTime = this.parseTime(new Date(), '{y}-{m}-{d}')
        if(this.upload.way=='0'){
          Object.assign(this.form, filterNull(res.data))
        }else if(this.upload.way=='1'||this.upload.way=='2'){
          Object.assign(this.form, filterNull(res.data.auditInfo))
        }
        console.log('formmmm', this.form)
      })
    },
    getStatus(){
      if(this.upload.type=='1'){
        return '发起会议通知'
      }else{
        // 流程状态:DRAFT(0, "草稿"), UNDO(1, "在办(送审)"), DONE(2, "办结(发布信息)"), AUDIT(6, "审批中"), AUDITED(7, "已审批"), FINISH(8, "已归档(已发送)"), REBACK(9, "已撤回")
        return this.form.businessStatusName
      }
    },
    openSelect(selectType){
      this.selectType = selectType
      this.$refs['select'].show()
    },
    getUserInfo(info, type){
      console.log('infooooooo', info, type)
      if(type=='reader'){
        this.form.readerNames = info.names
        this.form.readerIds = info.ids
        this.form.readerAccounts = info.accounts
      }else if(type=='leader'){
        this.form.meetLeader = info.names
        this.form.meetLeaderId = info.ids
      }else if(type=='auditor'){
        this.form.auditorNames = info.names
        this.form.auditorIds = info.ids
        this.form.auditorAccounts = info.accounts
      }
    },
    handleSubmit(type){
      console.log('submit', this.form, type)
      if(this.upload.way=='0'){
        if(type==0){
          this.form.operateType = 'draft'
        }else{
          this.form.operateType = 'complete'
        }
        if(this.upload.type=='1'){
          this.form.publishScope = 'DESIGNEE'
          this.form.receiptStatus = 1
          this.form.busiAttachIds = this.fileList.map(t => t.id).join(',')
        }
        auditSave(this.form.operateType, replaceFormData(this.form)).then(res=>{
          this.$message.success("提交成功")
          this.upload.open=false
          this.$emit('getList')
        })
      }else if(this.upload.way=='2'){
        let params = {
					auditMemo: this.form.auditMemo,
					id: this.upload.row.id,
        }
        if(type==0){
          params.operateType = 'draft'
        }else{
          params.operateType = 'complete'
        }
        getMessage(params).then(res=>{
          this.$message.success("提交成功")
          this.upload.open=false
          this.$emit('getList')
        })
      }else if(this.upload.way=='1'){
        let params = {
					noticeId: this.upload.row.id,
					receiptMemo: this.form.meetAttendStatus=='1'?this.form.receiptMemo:'参会',
					meetAttendStatus: this.form.meetAttendStatus || ''
        }
        updateRead(params).then(res=>{
          this.$message.success("提交成功")
          this.upload.open=false
          this.$emit('getList')
        })
      }
    },
    // 附件上传
    handleUpload(fileList) {
      this.fileList = fileList
    },
  }
}
</script>
    
<style lang="scss" scoped>
.message {
  border: 1px solid #CFCCCC;

  .message-item {
    border-bottom: 1px solid #CFCCCC;

    &:last-child {
      border-bottom: none;
    }
  }
}
.hed {
  font-weight: 700;
  color: #606266;
  width: 125px;
  text-align: right;
  padding-right: 10px;
}
.content {
  padding: 10px;
  border-left: 1px solid #CFCCCC;
}

.detail-class{
  ::v-deep .el-dialog__header {
    width: 100%;
    background-color: #2d75d7;
    padding: 20px;
    padding-bottom: 10px;
  }
}
.header {
  background-color: #2D75D7;
}
::v-deep .el-radio__original {
  display: none !important;
}
::v-deep .el-radio:focus:not(.is-focus):not(:active):not(.is-disabled) .el-radio__inner {
  box-shadow: none !important;
}
.title {
  color: #555555;
  font-size: 24px;
  text-align: center;
}
</style>
